<div class="container" id="container">
    <div id="myPrintArea">
        <style media="print,screen">
            body{
                background-color: #ffffff;;
                font-size: 16px;;
                height: 100%;
            }
            p{
                margin: 0px !important;
            }
            table{border:1px solid #000000 !important;border-collapse: collapse !important;margin-bottom: 0px !important;;}
            table td{
                border:1px solid #000000;
                display: table-cell !important;
                vertical-align: middle !important;
            }

            .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
                padding: 6px;
                line-height: 1.42857143;
                vertical-align: top;
                border-top: 1px solid #000000;
            }
            .container{
                padding: 2% 4%;
                height: 100%;
            }
            .table{

            }
            .title {
                text-align: center;
                font-size: 2em;
            }
            #myPrintArea{
                margin: 0 auto;
                height: 100%;
            }
            #printTableArea{
                height: 100%;
            }
            .footer {
                text-align: right;
            }

            .content {
                padding: 20px 50px !important;
            }

            .content_title {
                margin-left: -30px;
            }
        </style>
        <table class="table" id="printTableArea">
            <tr>
                <td colspan="2" class="title">户外广告（招牌）申请备案登记表</td>
            </tr>
            <tr>
                <td  style="text-align: center;width: 16%">
                    业务编号
                </td>
                <td >
                    <span>{$info.a_bianhao}</span>
                </td>
            </tr>
            <tr>
                <td  style="text-align: center;">
                    申请单位
                </td>
                <td >
                    <span>{$info.danwei_name}</span>
                </td>
            </tr>
            <tr>
                <td style="text-align: center;">
                    广告公司
                </td>
                <td>
                    <span>{$info.company_name}</span>
                </td>
            </tr>
            <tr>
                <td style="text-align: center;">
                    建设地点
                </td>
                <td>
                    <span>广东省中山市小榄镇{$info.daolu}{$info.address}</span>
                </td>
            </tr>
            <tr>
                <td style="text-align: center;">
                    设置时间
                </td>
                <td>
                    <span>{$info.start_set_time} 至 {$info.end_set_time}</span>
                </td>
            </tr>
            <tr>
                <td style="text-align: center;">
                    广告类型
                </td>
                <td colspan="2" style="padding: 0px;margin: 0px;border: 0px !important;border-right: 1px solid #000000 !important; ">
                    <table class="table table-a" style="margin-bottom: 0px;background-color:transparent;height: 100%">
                        <td class="left-td" style="border: 1px solid #ffffff;border-right: 1px solid #000000 ;">
                            <span>{$info.a_ad_type}</span>
                        </td>
                        <td class="left-td"  style="border: 1px solid #ffffff;border-right: 1px solid #000000 ;">
                            广告面积
                        </td>
                        <td class="right-td"  style="border: 1px solid #ffffff;">
                            <span>{$info.a_mianji}</span>平方米
                        </td>
                    </table>
                </td>
            </tr>
            <tr>
                <td style="text-align: center;">
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                     城<br/>管<br/>分<br/>局<br/>审<br/>查<br/>意<br/>见<br/>
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                </td>
                <td colspan="3" style="vertical-align:middle">
                    <span>{$info.yijian}</span>
                </td>
            </tr>
            <tr>
                <td  style="text-align: center;">
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                    备<br/>注<br/>
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                    <br/>
                </td>
                <td colspan="3" style="vertical-align:middle">
                    <span>{$info.remark}</span>
                </td>
            </tr>
        </table>
    </div>
    <div class="btn-group btn-group-lg noprint" role="group" aria-label="..." style="float: right;">
        <button type="button" class="btn btn-default" id="closePage">关闭</button>
        <button type="button" class="btn btn-default" id="print">打印</button>
    </div>
</div>
<script src="__PUBLIC__/js/jquery-printArea.js"></script>
<script>
    $(document).ready(function(){
        setWHbyDPI();
    });
    function setWHbyDPI(){
        var dpi = js_getDPI();
        var width = 0;
        var height = 0;
        switch (dpi){
            case 72:
                    width = 595;
                    height = 842;
                break;
            case 120:
                width = 1487;
                height = 2105;
                break;
            case 150:
                width = 1240;
                height = 1754;
                break;
            case 300:
                width = 2480;
                height = 3508;
                break;
            default :
                width = 794;
                height = 1123;
                break;
        }
        $("#container").width(width);
        $("#container").height(height);
    }
    $("#closePage").click(function () {
        window.opener=null;window.open('','_self');window.close();
    });
    $("#print").click(function () {
        $("#myPrintArea").printArea();
        //window.print();
    });
    function js_getDPI() {
        var arrDPI = new Array();
        if (window.screen.deviceXDPI != undefined) {
            arrDPI[0] = window.screen.deviceXDPI;
            arrDPI[1] = window.screen.deviceYDPI;
        }
        else {
            var tmpNode = document.createElement("DIV");
            tmpNode.style.cssText = "width:1in;height:1in;position:absolute;left:0px;top:0px;z-index:99;visibility:hidden";
            document.body.appendChild(tmpNode);
            arrDPI[0] = parseInt(tmpNode.offsetWidth);
            arrDPI[1] = parseInt(tmpNode.offsetHeight);
            tmpNode.parentNode.removeChild(tmpNode);
        }
        return arrDPI;
    }
</script>